
<template>
    <div class="ChangeForm">
        <Row>
            <Form ref="formValidate" :model="formValidate" :label-width="80">
                <Col span="24">
                    <Row>
                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                            <FormItem label="申请编号" prop="applyNo">
                                <Input clearable v-model="formValidate.applyNo" placeholder />
                            </FormItem>
                        </Col>
                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6" v-if="!isSP">
                            <FormItem label="合同号" prop="contractNo">
                                <Input clearable v-model="formValidate.contractNo" placeholder />
                            </FormItem>
                        </Col>
                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                            <FormItem label="客户姓名" prop="custName">
                                <Input clearable v-model="formValidate.custName" placeholder />
                            </FormItem>
                        </Col>

                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6" v-if="!isSP">
                            <FormItem label="来源" prop="caseSource">
                                <Select v-model="formValidate.caseSource" placeholder clearable>
                                    <Option v-for="(item,index) in dataDict.caseSourceDict" :key="index" :value="item.value">{{item.title}}</Option>
                                </Select>
                            </FormItem>
                        </Col>

                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                            <FormItem label="处理状态" prop="processStatus">
                                <Select v-model="formValidate.processStatus" clearable placeholder>
                                    <Option v-for="(item,index) in dataDict.insuranceProcessStatusDict" :key="index" :value="item.value">{{item.title}}</Option>
                                </Select>
                            </FormItem>
                        </Col>
                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6" v-if="!isSP">
                            <FormItem label="变更主体" prop="changeSubject">
                                <Select v-model="formValidate.changeSubject" placeholder clearable>
                                    <Option v-for="(item,index) in dataDict.PersonRoleTypeDict" :key="index" :value="item.value">{{item.title}}</Option>
                                </Select>
                            </FormItem>
                        </Col>
                        <!-- <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6" v-if="!isSP">
                            <FormItem label="案件类型" prop="processStatus">
                                <Select v-model="formValidate.processStatus" placeholder="请选择" clearable>
                                    <Option v-for="(item,index) in []" :key="index" :value="item.value">{{item.title}}</Option>
                                </Select>
                            </FormItem>
                        </Col>-->
                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6">
                            <FormItem label="申请时间" prop="createDate">
                                <!-- <DatePicker
                                    type="date"
                                    format="yyyy-MM-dd"
                                    placeholder="请选择"
                                    v-model="formValidate.startDate"
                                ></DatePicker>-->
                                <DatePicker
                                    v-model="formValidate.createDate"
                                    type="daterange"
                                    format="yyyy-MM-dd"
                                    separator=" 到 "
                                    clearable
                                    @on-change="createDateRange"
                                    placeholder="选择起始时间"
                                ></DatePicker>
                            </FormItem>
                        </Col>
                        <Col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" :xxl="6" v-if="!isSP">
                            <FormItem label="结束时间" prop="finishDate">
                                <!-- <DatePicker type="date" format="yyyy-MM-dd" placeholder="请选择" v-model="formValidate.endDate"></DatePicker> -->
                                <DatePicker
                                    v-model="formValidate.finishDate"
                                    type="daterange"
                                    separator=" 到 "
                                    format="yyyy-MM-dd"
                                    clearable
                                    @on-change="finishDateRange"
                                    placeholder="选择起始时间"
                                ></DatePicker>
                            </FormItem>
                        </Col>
                    </Row>
                </Col>

                <Col span="24">
                    <div class="contract-close-btns">
                        <Button type="primary" @click="handleSubmit('formValidate')" icon="ios-search" style="margin-right:16px">搜索</Button>
                        <Button type="primary" @click="handleReset('formValidate')" icon="ios-trash-outline">重置</Button>
                    </div>
                </Col>
            </Form>
        </Row>
    </div>
</template>
<script>
export default {
    props: {
        formValidate: {
            type: Object,
            required: true
        },
        formValidateRule: {
            type: Object,
            required: true
        },
        dataDict: {
            type: Object,
            required: true
        },
        loading: {
            type: Boolean,
            required: true,
            default: true
        },
        isSP: {
            type: Boolean,
            required: true,
            default: true
        }
    },
    data() {
        return {
            // loading: false,
            createDate: null,
            finishDate: null
        };
    },
    mounted() { },
    methods: {
        init() { },
        // 查询
        handleSubmit(name) {
            this.formValidate.pageNumber = 1;
            if (this.loading) return;
            this.$refs[name].validate(valid => {
                if (valid) {
                    // this.loading = true;
                    this.$emit("getList", this.formValidate);
                }
            });
        },
        handleReset(name) {
            this.$refs[name].resetFields();
            this.formValidate.pageNumber = 1;
            this.formValidate.startCreateDate = '';
            this.formValidate.endCreateDate = '';
            this.formValidate.startFinishDate = '';
            this.formValidate.endFinishDate = '';
            this.handleSubmit(name)
        },
        openModal() {
            this.$emit("showModal", true);
        },
        createDateRange(v) {
            if (v) {
                this.formValidate.startCreateDate = v[0];
                this.formValidate.endCreateDate = v[1];
            }
        },
        finishDateRange(v) {
            if (v) {
                this.formValidate.startFinishDate = v[0];
                this.formValidate.endFinishDate = v[1];
            }
        }
    }
};
</script>
<style scoped>
.contract-close-btns {
    padding-bottom: 28px;
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: center;
}
</style>
